<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="lib/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <script src="lib/jquery/jquery.1.10.2.min.js"></script>
    <script src="lib/bootstrap/js/bootstrap.min.js"></script>
    <script src="lib/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="lib/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="lib/website/function.js"></script>
    <script src="lib/website/interface.js"></script>
    <style type="text/css">
    body {
        background-image: url(img/background-12.jpg);
        background-size: cover;
    }

    .login-modal .modal-header {
        background-color: #3c73c3;
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
    }

    .login-modal h2 {
        color: #fff;
        line-height: 70px;
        height: 70px;
    }

    .login-modal .modal-content {
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
    }

    .login-modal .form-group {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .login-modal .form-control {
        display: block;
        height: 50px;
        padding: 10px 12px;
        line-height: 50px;
        border-radius: 4px;
    }

    .login-modal .btn {
        line-height: 50px;
        height: 50px;
        font-size: 21px;
        font-weight: 500;
        letter-spacing: 1px;
        padding: 0px;
        border-radius: 25px;
        background-color: #3c73c3;
        border-color: #3c73c3;
    }
    </style>
</head>

<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-4 col-xs-4 col-md-offset-4 col-xs-offset-4">
                <div class="modal show login-modal">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h2 class="modal-title text-center">辽宁环保攻坚考核系统</h2>
                            </div>
                            <div class="modal-body">
                                <form class="form-horizontal">
                                    <fieldset>
                                        <div class="form-group">
                                            <div class="col-md-10 col-md-offset-1">
                                                <div class="input-group">
                                                    <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                                                    <input id='userId' type="text" class="form-control" placeholder="请输入账号" value="sys">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="col-md-10 col-md-offset-1">
                                                <div class="input-group">
                                                    <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                                                    <input id="password" type="password" class="form-control" placeholder="请输入密码" value="123456">
                                                </div>
                                            </div>
                                        </div>
                                    </fieldset>
                                </form>
                            </div>
                            <div class="modal-footer">
                                <div class="form-group">
                                    <div class="col-md-8 col-md-offset-2">
                                        <a id='login-btn' href='#' class="btn btn-primary btn-block">立即登录</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript">
$("#login-btn").click(function(event) {
    var ret = login($('#userId').val(), $('#password').val());
});


// 自适应高度
function autoHeight() {
    var height = $(window).height();
    $(".login-modal").css('margin-top', height / 2 - 196);
}
$(function() {
    autoHeight();
    $(window).resize(autoHeight);
});
</script>

</html>